<div align="center" style="padding-top: 49px;">
	<div>
		<img src="<?php echo base_url();?>media/images/default/1.jpg">
	</div>
	<div id="product">
		<div class="clearfix" id="jv-component">
			<div style="margin-bottom: 20px;font-weight: bold;color:#eb7a00;"><?php echo $project->name ?></div>
			<div class="blog">
				<table>
					<tr>
						<td width="480">
							<ul class="ppt" style="margin-top: 0px">
								<li><?php foreach ($library as $row){ ?> <li><img width="480"
									height="250" src="<?php echo base_url();?>upload/library/<?php echo $row->image ?>"></img>
								</li>
								<?php } ?>
							</ul>
						</td>
					</tr>
					<tr>
						<td width="480" align="center" style="padding-top: 260px">
							<p>
								<img src="<?php echo base_url();?>media/images/default/bk.png"
									alt="" onclick="btnback();" /><img
									src="<?php echo base_url();?>media/images/default/stop.png"
									alt="" onclick="btnpause();" /><img
									src="<?php echo base_url();?>media/images/default/fw.png"
									alt="" onclick="btnfwd();" />
							</p>
						
						</td>
					</tr>
				</table>
			</div>
		</div>
	</div>
	<div>
		<img src="<?php echo base_url();?>media/images/default/3.jpg">
	</div>
</div>
<p style="text-align: left">
<?php echo $this->pagination->create_links();?>
</p>
<script type="text/javascript" src="<?php echo base_url();?>media/js/jquery-1.4.4.min.js"></script>
<script type="text/javascript">
$('.ppt li:gt(0)').hide();
$('.ppt li:last').addClass('last');
$('.ppt li:first').addClass('first');
$('#play').hide();

var cur = $('.ppt li:first');
var interval;

$('#fwd').click( function() {
	goFwd();
	showPause();
} );


$('#back').click( function() {
	goBack();
	showPause();
} );

$('#stop').click( function() {
	stop();
	showPlay();
} );

$('#play').click( function() {
	start();
	showPause();
} );

function btnback() {
	goBack();
	showPause();
} 
function btnplay() {
	start();
	showPause();
} 
function btnpause() {
	stop();
	showPlay();
} 
function btnfwd() {
	goFwd();
	showPause();
} 
function goFwd() {
	stop();
	forward();
	start();
}

function goBack() {
	stop();
	back();
	start();
}

function back() {
	cur.fadeOut( 1000 );
	if ( cur.attr('class') == 'first' )
		cur = $('.ppt li:last');
	else
		cur = cur.prev();
	cur.fadeIn( 1000 );
}

function forward() {
	cur.fadeOut( 1000 );
	if ( cur.attr('class') == 'last' )
		cur = $('.ppt li:first');
	else
		cur = cur.next();
	cur.fadeIn( 1000 );
}

function showPause() {
	$('#play').hide();
	$('#stop').show();
}

function showPlay() {
	$('#stop').hide();
	$('#play').show();
}

function start() {
	interval = setInterval( "forward()", 3000 );
}

function stop() {
	clearInterval( interval );
}

$(function() {
	start();
} );
</script>
